import React, { Component } from 'react'
import { connect } from 'react-redux'
import { add, jian, addAsync } from '../../action/count'
// connect react-redux提供的一个高阶组件，里面的第一个参数是一个方法，这个方法有一个参数state
//实际上是getState()的值
const mapStateToProps = state => {
  console.log(state)
  return {
    counter: state.count.counter
  }
}
// connect react-redux提供的一个高阶组件，里面的第二个参数是mapDispatchToProps，
//这个方法有一个参数dispatch实际就是store.dispatch()方法
// const mapDispatchToProps = dispatch => {
//   return {
//     add: () => {
//       dispatch(add())
//     },
//     jian: () => {
//       dispatch(jian())
//     }
//   }
// }

@connect(
  mapStateToProps,
  { add, jian, addAsync }
)
export default class SysSetting extends Component {
  render() {
    console.log(this.props)
    const { counter, add, jian, addAsync } = this.props
    return (
      <div>
        系统设置
        <div>
          <button onClick={jian}>-</button>
          <span>{counter}</span>
          <button onClick={add}>+</button>
          <button onClick={addAsync}>异步+</button>
        </div>
      </div>
    )
  }
}
